<script lang="tsx" setup>
/**
 *  库存结存子单
 */
import {ref, nextTick} from "vue"
import {definePageModel, PageModel} from "@/frame/view/layout/page-model/constructor.ts"
import {defineDialogForm, DialogForm} from "@/frame/components/base/dialog-form/constructor.ts"
import {WarehouseTypeEnum} from "./order-detail.ts"

/**
 * 弹窗配置
 */
const dialogFormRef = ref()
const dialogFormConfig = defineDialogForm({
  width: "1200px",
  title: "库存结存详情"
})
/**
 * 页面配置
 */
const pageModelRef = ref()
const config = definePageModel<any>({
  url: "/api/WarehouseBalance/item",
  getImmediate: false,
  otherParams: {
    id: null
  },
  table: {
    page: {
      enable: true,
      pageSize: 20
    },
    props: {
      stripe: false,
      border: false
    },
    els: [
      {
        label: "物料编码",
        prop: "goodsCode",
        minWidth: 120
      },
      {
        label: "物料名称",
        prop: "goodsName",
        minWidth: 120
      },
      {
        label: "物料规格",
        prop: "goodsSpec",
        minWidth: 120
      },
      {
        label: "仓库编码",
        prop: "warehouseCode",
        minWidth: 120
      },
      {
        label: "仓库名称",
        prop: "warehouseName",
        minWidth: 120
      },
      {
        label: "仓位编码",
        prop: "warehousePositionCode",
        minWidth: 120
      },
      {
        label: "仓位名称",
        prop: "warehousePositionName",
        minWidth: 120
      },
      {
        label: "状态",
        prop: "type",
        minWidth: 120,
        renderFn(data) {
          return <span>
                      {WarehouseTypeEnum[data.type]}</span>
        }
      },
      {
        label: "批次号",
        prop: "batchNumber",
        minWidth: 120
      },
      {
        label: "出库数量",
        prop: "number_Out",
        minWidth: 120
      },
      {
        label: "入库数量",
        prop: "number_In",
        minWidth: 120
      },
      {
        label: "实时库存",
        prop: "number_Real",
        minWidth: 200
      },
      {
        label: "是否为当期",
        prop: "currentPeriod",
        minWidth: 200,
        renderFn(data) {
          if (data.currentPeriod) {
            return <span>为当期</span>
          } else {
            return <span>不为当期</span>
          }
        }
      },
      {
        label: "制单时间",
        prop: "createTime",
        minWidth: 200
      }
    ]
  }
})

/**
 * 显示
 */
const show = (params: any) => {
  nextTick(() => {
    if (config.otherParams) {
      config.otherParams.id = params.id
    }
    dialogFormRef.value.show()
    nextTick(() => {
      pageModelRef.value.refreshTableData()
    })
  })
}

/**
 * 暴露
 */
defineExpose({
  show
})
</script>

<template>
  <DialogForm ref="dialogFormRef" :dialogFormModel="dialogFormConfig">
    <template #default>
      <div style="display: flex;height: 500px;">
        <PageModel ref="pageModelRef" :PageModel="config"/>
      </div>
    </template>
  </DialogForm>
</template>
